<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script th:src="@{/js/image.js}"></script>
    <title></title>


    <style type="text/css">
        .search_input {
            overflow: visible;
            background-color: #FFFFFF;
            background-image: none;
            border: 1px solid #e5e6e7;
            border-radius: 1px;
            color: inherit;
            display: block;
            padding: 6px 12px;
            transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
        }
    </style>
</head>

<body>


<div class="breadcome-area">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="breadcome-list single-page-breadcome">
                    <div class="row">
                        <!--                                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">-->
                        <!--                                        <div class="breadcome-heading">-->
                        <!--											<form id="searchForm" role="search" class="sr-input-func">-->
                        <!--												<input type="text" name="problemInfo" placeholder="请输入问题描述" class="search-int form-control">-->
                        <!--												<a href="javascript:void(0)" onclick="operation.searchForm()"><i class="fa fa-search"></i></a>-->
                        <!--											</form>-->
                        <!--                                        </div>-->
                        <!--                                    </div>-->
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                            <div class="row">

                                <form id="searchForm">
                                    <div class="col-lg-3 col-md-3 col-sm-3">
                                        <input type="text" name="problemInfo" placeholder="请输入问题描述"
                                               class="search-int form-control">
                                    </div>
                                    <div class="col-lg- col-md-3 col-sm-3">
                                        <input type="text" name="trainNo" placeholder="请输入车辆编号"
                                               class="search-int form-control">
                                    </div>

                                </form>
                                <div class="col-lg-2 col-md-2 col-sm-2">
                                    <button class="btn btn-primary" onclick="operation.searchForm()">查询</button>
                                    <!--
                                                                                <a href="javascript:void(0)" onclick="operation.searchForm()"><i class="fa fa-search"></i></a>
                                    -->
                                </div>


                            </div>
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                            <ul class="breadcome-menu">
                                <li><a href="#">首页</a> <span class="bread-slash">/</span>
                                </li>
                                <li><span class="bread-blod">执行维修</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="mg-b-15">
    <div class="container-fluid">
        <div class="row">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div class="product-status-wrap drp-lst">
                    <h4>执行维修</h4>
                    <!--<div class="add-product">
                        <a href="#"onclick="operation.addWindow()">添加</a>
                    </div>-->
                    <div class="asset-inner">

                        <table id="dg"></table>


                    </div>


                </div>
            </div>
        </div>
    </div>
</div>


<!-- 第一个model 开始 -->
<div id="setFormModal" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" data-keybord="false">
    <div class="modal-dialog" style="width:700px">
        <div class="modal-content">
            <div class="modal-header">
                编辑
            </div>
            <!-- modal-body 开始 -->
            <div class="modal-body">
                <form id="setFormId" class="form-horizontal" enctype="multipart/form-data">
                    <input type="hidden" name="id">


                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label text-right" for="handleStatus">处理状态</label>
                        <div class="col-sm-8">
                            <select class="form-control" name="handleStatus" placeholder="请输入处理状态">
                                <option value="完成">完成</option>
                                <option value="更换">更换</option>
                                <option value="报废">报废</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label text-right" for="pic">上传照片</label>
                        <div class="col-sm-8">
                            <img id="pic" style="width:100px;height:100px;" src="/images/timg.jpg">
                            <input id="upload" name="files" accept="image/*" type="file" style="display: none">
                        </div>
                    </div>


                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label text-right" for="handleInfo">导致原因</label>
                        <div class="col-sm-8">
                            <textarea class="form-control" rows="3" name="handleInfo"
                                      placeholder="请输入导致原因"></textarea>
                        </div>
                    </div>

                </form>
            </div>
            <!-- modal-body 结束 -->
            <div class="modal-footer">
                <button id="add_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.addForm()">
                    <span class="glyphicon glyphicon-ok"></span>保存
                </button>
                <button id="edit_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.editForm()">
                    <span class="glyphicon glyphicon-ok"></span>保存
                </button>
                <button id="delete_save_btn" type="button" class="btn btn-default btn-outline btn-sm"
                        onclick="operation.closeMoal()">
                    <span class="glyphicon glyphicon-remove"></span>关闭
                </button>
            </div>

        </div>
    </div>
</div>
<!-- 第一个model 结束 -->


<!-- 第二个model 开始 -->
<div id="setFormOutModal" class="modal fade" tabindex="-1" role="dialog" data-backdrop="static" data-keybord="false">
    <div class="modal-dialog" style="width:800px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

                编辑
            </div>
            <!-- modal-body 开始 -->
            <div class="modal-body">
                <form id="setFormOutId" class="form-horizontal" enctype="multipart/form-data">
                    <input type="hidden" name="id">

                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label text-right" for="equipmentId">设备</label>
                        <div class="col-sm-4">
                            <select class="form-control" name="equipmentId" id="equipmentId"
                                    placeholder="请输入设备"></select>
                        </div>

                        <label class="col-sm-2 col-form-label text-right" for="equipmentId">设备剩余数量</label>
                        <div class="col-sm-4">
                            <input class="form-control" id="num2" readonly placeholder="设备剩余数量"/>
                        </div>
                    </div>


                    <div class="form-group row">
                        <label class="col-sm-2 col-form-label text-right" for="num">数量</label>
                        <div class="col-sm-4">
                            <input class="form-control" name="num" type="number" placeholder="请输入数量"/>
                        </div>

                        <div class="col-sm-2">
                            <button type="button" class="btn btn-default btn-outline btn-sm"
                                    onclick="operationOut.addForm()">
                                <span class="glyphicon glyphicon-ok"></span>新增
                            </button>
                        </div>

                    </div>


                </form>

                <table id="dgOut"></table>
            </div>
            <!-- modal-body 结束 -->
            <div class="modal-footer">

            </div>

        </div>
    </div>
</div>
<!-- 第二个model 结束 -->


<!-- Page-Level Scripts -->
<script type="text/javascript" th:inline="none">
    getZcxEquipmentList("equipmentId");

    $("#equipmentId").change(function () {
        var equipmentId = $("#equipmentId").val();
        //	alert("equipmentId=" + equipmentId);

        $.post("/ZcxEquipment/findList", {id: equipmentId}, function (data) {

//console.info(data)
            $('#num2').val(data[0].num);

        });
    })
    var id2;
    var operation = {
        searchForm: function () {
            $('#dg').bootstrapTable("refresh");
        },
        //弹出添加页面
        addWindow: function () {
            $('#setFormModal').modal('show');
            formObj.setBtnIsShow("add_save_btn", "edit_save_btn", 1);

        },
        //添加表单
        addForm: function () {
            $("#setFormId").bootstrapValidator('validate');
            if ($("#setFormId").data("bootstrapValidator").isValid()) {
                var temp = getFormJson("setFormId");


                $.post("/ZcxProblemHandle/insertZcxProblemHandle", temp, function (data) {

                    $("#dg").bootstrapTable("refresh");
                    message.alert(data.showInfo);
                    $('#setFormId').data('bootstrapValidator').resetForm(true);
                    $('#setFormId')[0].reset();
                    $('#setFormModal').modal('hide');
                });
            }

        },
        //弹出修改页面
        editWindow: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            setForm("#setFormId", row);
            $('#setFormModal').modal('show');
            formObj.setBtnIsShow("add_save_btn", "edit_save_btn", 0);

        },
        //修改表单
        editForm: function () {
            var validate = $("#setFormId").bootstrapValidator('validate');
            if ($("#setFormId").data("bootstrapValidator").isValid()) {
                var temp = getFormJson("setFormId");


                $.ajaxFileUpload
                ({
                    url: "/ZcxProblemHandle/updateZcxProblemHandle", //用于文件上传的服务器端请求地址
                    secureuri: false, //是否需要安全协议，一般设置为false
                    data: temp,
                    fileElementId: ['upload'],//['file-0c','upload'], //文件上传域的ID

                    dataType: 'application/json', //返回值类型 一般设置为json
                    success: function (data, status)  //服务器成功响应处理函数
                    {
                        message.alert("保存成功！");
                        $('#setFormId')[0].reset();
                        $('#setFormModal').modal('hide');
                    },
                    error: function (data, status, e)//服务器响应失败处理函数
                    {
                        /* message.alert("保存成功！"); */

                    }
                })


                /*		$.post("/ZcxProblemHandle/updateZcxProblemHandle", temp ,function(data) {

                            $("#dg").bootstrapTable("refresh");
                            message.alert(data.showInfo);
                            $('#setFormId').data('bootstrapValidator').resetForm(true);
                            $('#setFormId')[0].reset();
                            $('#setFormModal').modal('hide');
                        });*/
            }

        },
        //删除表单
        deleteFrom: function (index) {
            var row = $("#dg").bootstrapTable("getData")[index];
            bootbox.confirm({
                size: "small",
                title: "提示",
                message: "确认删除这条数据吗？",
                callback: function (result) {
                    if (result) {
                        $.post("/ZcxProblemHandle/deleteZcxProblemHandle", {id: row.id}, function (data) {

                            $("#dg").bootstrapTable("refresh");
                            message.alert(data.showInfo);

                        });

                    }
                }
            });


        },
        //关闭页面
        closeMoal: function () {
            $('#setFormId').data('bootstrapValidator').resetForm(true);
            //$('#setFormId').reset();
            $('#setFormModal').modal('hide');
        },
        //导出
        exportFile: function () {


        },
        //审核
        audit: function () {


        },
        handleFrom: function (id) {
            id2 = id;
            $('#setFormOutModal').modal('show');

            var columnsOut = [[
                {
                    field: 'ck',
                    width: '2%',
                    checkbox: false,
                    align: 'center',

                },
                {
                    field: 'id',
                    title: 'id',
                    width: 10,
                    align: 'center',
                    visible: false
                },


                {title: '设备名称', field: 'equipmentName', align: 'center', valign: 'middle', visible: true},
                {title: '设备类型', field: 'equipmentType', align: 'center', valign: 'middle', visible: true},

                {title: '设备', field: 'equipmentId', align: 'center', valign: 'middle', visible: false},
                {title: '执行', field: 'excuteId', align: 'center', valign: 'middle', visible: true},
                {title: '数量', field: 'num', align: 'center', valign: 'middle', visible: true},
                // {title: '创建时间', field: 'createTime', align: 'center', valign: 'middle',visible:true},
                {title: '操作人', field: 'userId', align: 'center', valign: 'middle', visible: false},
                {title: '操作人', field: 'name', align: 'center', valign: 'middle', visible: true},

                {
                    title: '操作',
                    field: 'opt',
                    align: 'center',
                    valign: 'middle',
                    visible: true,
                    formatter: function (value, row, index) {

                        var html = '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operationOut.deleteFrom(' + index + ')">撤回</button>';
                        return html;
                    }
                },


            ]];

            $('#dgOut').bootstrapTable("destroy");
            $('#dgOut').bootstrapTable({
                url: "/ZcxEquipmentOut/query",
                sidePagination: "server",
                queryParams: function (params) {
                    var temp = {};
                    temp.excuteId = id;
                    temp.rows = params.limit;
                    temp.currentPage = (params.offset / params.limit) + 1;
                    return temp;

                },
                method: "post",
                contentType: "application/x-www-form-urlencoded",
                pagination: true,
                pageNumber: 1,
                pageSize: 10,
                pageList: [10, 25, 50, 100],
                //search:true,
                clickToSelect: true,
                singleSelect: true,
                toolbar: '#toolbar',
                columns: columnsOut,
            })

        },

    }


    var operationOut = {

        //添加表单
        addForm: function () {

            var temp = getFormJson("setFormOutId");
            if (temp.equipmentId == "" || temp.equipmentId == null) {
                message.alert("请选择设备名称");
                return;
            }
            if (temp.num == "" || temp.num == null) {
                message.alert("请输入设备数量");
                return;
            }
            var num2 = $("#num2").val();
            if (Number(num2) < Number(temp.num)) {
                message.alert("剩余数量不足");
                return;
            }

            temp.excuteId = id2;
            $.post("/ZcxEquipmentOut/insertZcxEquipmentOut", temp, function (data) {

                $("#dgOut").bootstrapTable("refresh");
                $('#setFormOutId')[0].reset();

            });


        },


        //删除表单
        deleteFrom: function (index) {
            var row = $("#dgOut").bootstrapTable("getData")[index];
            bootbox.confirm({
                size: "small",
                title: "提示",
                message: "确认撤回这条数据吗？",
                callback: function (result) {
                    if (result) {
                        $.post("/ZcxEquipmentOut/deleteZcxEquipmentOut", {id: row.id}, function (data) {

                            $("#dgOut").bootstrapTable("refresh");
                            message.alert(data.showInfo);

                        });

                    }
                }
            });


        },
        //关闭页面
        closeMoal: function () {
            $('#setFormId').data('bootstrapValidator').resetForm(true);
            //$('#setFormId').reset();
            $('#setFormModal').modal('hide');
        },


    }


    $(function () {
        //表格格式化
        var fmt = {
            queryParams: function (params) {
                var temp = getFormJson("searchForm");
                temp.rows = params.limit;
                temp.userId = $("#userId").val();
                temp.currentPage = (params.offset / params.limit) + 1;
                return temp;

            },
            setTime: function (value, row, index) {

                return formatTimeYMDhms(value);  //转成年月日时分秒
            },
            setOpt: function (value, row, index) {
                var html = '';
                /* '<button class="btn-white btn btn-xs">查看</button>'+ */
                html += '<button id="edit_btn" class="btn btn-outline-secondary btn-sm"  onclick="operation.editWindow(' + index + ')">执行</button>';
                if (row.handleStatus == "更换") {
                    html += '<button class="btn btn-outline-secondary btn-sm"  onclick="operation.handleFrom(' + row.id + ')">更换</button>';

                }
                return html;
            },
            setActImgUrl: function (value, row, index) {
                return '<img src="/TBook/queryPic?id=' + row.id + '" style="width:100px;heigth:100px"></img>';
            },
            setBorrow: function (value, row, index) {
                var htm = "";
                if (row.borrow == 0) {
                    htm = "未借阅";
                }
                if (row.borrow == 1) {
                    htm = "<span style='color:red;'>已借阅</span>";
                }
                return htm;
            },
        }

        var columns = [[

            {
                field: 'id',
                title: 'id',
                width: 10,
                align: 'center',
                visible: false
            },


            {title: '问题Id', field: 'problemId', align: 'center', valign: 'middle', visible: false},
            {title: '分配人', field: 'userId', align: 'center', valign: 'middle', visible: false},

            {title: '检修员', field: 'name', align: 'center', valign: 'middle', visible: true},
            {title: '问题类型', field: 'problemType', align: 'center', valign: 'middle', visible: true},
            {title: '问题描述', field: 'problemInfo', align: 'center', valign: 'middle', visible: true},
            {title: '机车', field: 'trainNo', align: 'center', valign: 'middle', visible: true},
            {title: '导致原因', field: 'handleInfo', align: 'center', valign: 'middle', visible: true},
            {title: '处理状态', field: 'handleStatus', align: 'center', valign: 'middle', visible: true},

            {title: '完成时间', field: 'createTime', align: 'center', valign: 'middle', visible: true, sortable: true},
            {title: '操作', field: 'opt', align: 'center', valign: 'middle', visible: true, formatter: fmt.setOpt},


        ]];


        $('#dg').bootstrapTable({
            url: "/ZcxProblemHandle/query",
            sidePagination: "server",
            queryParams: fmt.queryParams,
            method: "post",
            contentType: "application/x-www-form-urlencoded",
            pagination: true,
            pageNumber: 1,
            pageSize: 10,
            pageList: [10, 25, 50, 100],
            //search:true,
            clickToSelect: true,
            singleSelect: true,
            toolbar: '#toolbar',
            columns: columns,
        })

    });


    $(function () {
        $("#setFormId").bootstrapValidator({
            /* live:'disabled',
            excluded:[':disabled'],
            feedbackIcons: {
        　　　　　　　　valid: 'glyphicon glyphicon-ok',
        　　　　　　　　invalid: 'glyphicon glyphicon-remove',
        　　　　　　　　validating: 'glyphicon glyphicon-refresh'
    　　　　　   },*/
            fields: {


                problemId: {
                    validators: {
                        notEmpty: {
                            message: "问题Id不能为空!",
                        },
                    }

                },


                userId: {
                    validators: {
                        notEmpty: {
                            message: "分配人不能为空!",
                        },
                    }

                },


                handleStatus: {
                    validators: {
                        notEmpty: {
                            message: "处理状态不能为空!",
                        },
                    }

                },


                handleInfo: {
                    validators: {
                        notEmpty: {
                            message: "导致原因不能为空!",
                        },
                    }

                },


                createTime: {
                    validators: {
                        notEmpty: {
                            message: "创建时间不能为空!",
                        },
                    }

                },


            }

        });


    })


</script>

</body>

</html>
